/**
* Created by yyr on 2018/1/10
*已设立基金》列表页
*/
<template>
    <div>
        <div class="right">
            <el-row>
                <el-col :span="6">
                    <el-button  icon="el-icon-plus" @click="add()" :disabled="!isAuthInvestedAdd" class="ca-color-download">新建已设立基金</el-button>
                </el-col>
                <el-col :span="18">
                    <div class="ca-pull-right">
                        <el-input  placeholder="基金名称，支持模糊查询" class="ca-w-280 ca-m-r-15" v-model="param.name" @keyup.enter.native="fundList">
                            <el-button slot="append" icon="el-icon-search" @click="fundList()"></el-button>
                        </el-input>
                        <el-button type="primary" @click="downloadFile" :disabled="!isAuthInvestedDownLoad">下载</el-button>
                    </div>
                </el-col>
            </el-row>
            <div class="ca-m-t-15">
                <el-table
                    :data="fundData"
                    border
                    @sort-change="sortChange"
                    style="width:100%" class="table_p_01 ca-table ca-tab__title">
                    <el-table-column label="序号" type="index" align="center" width="70px">
                        <template slot-scope="scope">
                            <csRedDot :label="(param.pageIndex-1)*param.pageSize+scope.$index+1+''"
                                      :showDot="scope.row.red == 1?true:false" :type="1"></csRedDot>
                        </template>
                    </el-table-column>
                    <el-table-column
                        label="基金名称"
                        sortable="custom"
                        prop="fundName">
                        <template slot-scope="scope">
                            <el-tooltip :content="scope.row.fundName" placement="top">
                                <el-button type="text" @click="fundDetail(scope.row.id)" :disabled='!isAuthInvestedFundDetail' class="ca-underline ca-text-over-flow-ellipsis">{{scope.row.fundName}}</el-button>
                            </el-tooltip>
                        </template>
                    </el-table-column>
                    <el-table-column
                    label="基金经理"
                    sortable="custom"
                    show-overflow-tooltip
                    prop="managerName">
                    </el-table-column>
                    <el-table-column
                        sortable="custom"
                        prop="estTime"
                        label="成立时间">
                    </el-table-column>
                    <el-table-column
                        sortable="custom"
                        prop="duration"
                        label="存续期">
                    </el-table-column>
                    <el-table-column
                        prop="inTheVote"
                        sortable="custom"
                        label="已投项目"
                        show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column
                        prop="scale"
                        sortable="custom"
                        :render-header="renderTitle"
                        label="基金规模</br>（万元）">
                        <template slot-scope="scope">
                            {{scope.row.scale | format1}}
                        </template>
                    </el-table-column>
                    <el-table-column
                        prop="paid"
                        sortable="custom"
                        :render-header="renderTitle"
                        label="实缴总额</br>（万元）">
                        <template slot-scope="scope">
                            {{scope.row.paid | format1}}
                        </template>
                    </el-table-column>
                    <el-table-column
                        prop="balance"
                        sortable="custom"
                        :render-header="renderTitle"
                        label="投资余额</br>（万元）">
                        <template slot-scope="scope">
                            {{scope.row.balance | format1}}
                        </template>
                    </el-table-column>
                    <el-table-column
                        prop="amount"
                        sortable="custom"
                        :render-header="renderTitle"
                        label="已分配收益</br>（万元）">
                        <template slot-scope="scope">
                            {{scope.row.amount | format1}}
                        </template>
                    </el-table-column>
                    <el-table-column
                        label="操作">
                        <template slot-scope="scope">
                            <el-button  type="text" size="small" @click="deleteData(scope.row.id)" :disabled="!isAuthInvestedDel">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <div class="ca-m-t-20 ca-align-center">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="param.pageIndex"
                    :page-sizes="vuePageSizes"
                    :page-size="param.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="totalCount">
                </el-pagination>
            </div>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
    import {api} from './api';
    import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    import { isNoAuth } from '__service/utils';
    export default {
        data() {
            return {
                isAuthInvestedAdd: isNoAuth('已设立基金-列表页-新建'),
                isAuthInvestedDel: isNoAuth('已设立基金-列表页-删除'),
                isAuthInvestedDownLoad: isNoAuth('已设立基金-列表页-下载'),
                isAuthInvestedFundDetail: isNoAuth('已设立基金-基金详情-查看'),
                currentPage: 1,
                fundData: [],
                param: {
                    name: '',
                    fundType: '',
                    fundState: 0,
                    pageIndex: 1,
                    pageSize: 30,
                    orderBy: '',
                    sort: '',//desc降序
                },
                size: null, //当前页的数量
                totalCount: null,//总记录数
                totalPage: null, //总页数
                keyName: '',
            }
        },
        watch: {
        },
        props: {},
        created() {
            this.fundList();
        },
        mounted() {
            this.fundList();
        },
        methods: {
             fundList() {
                 this.keyName = this.param.name;
                 apiHttp(api.EST_FUNDS,this.param).then( ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.fundData = ret.data.resultData;
                        this.totalPage = ret.data.totalPage;  //总页数
                        this.size = ret.data.size;   //当前页的数量
                        this.totalCount = ret.data.totalCount; //总记录数
                    }
                })
            },
            add() {
                    this.$router.push({name: 'investing-funds-add'})
                },
            deleteData(id) {
                this.$confirm('是否删除已设立基金?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning',
                    showClose: false
                }).then(async () => {
                    apiHttp(api.DELETE_FUND,{id: id}).then(ret=> {
                        if (ret.resCode === STATUS_HTTP_SUCCESS) {
                            this.$message({
                                type: 'success',
                                message: '删除成功!',
                                center: true
                            });
                            this.fundList()
                        }
                    });
                });
            },
            //排序
            sortChange(params) {
                 if (!params.order) {
                     this.param.orderBy = '';
                     this.param.sort = '';
                 } else {
                     this.param.sort = params.order === 'ascending' ? 'asc' : 'desc';
                     this.param.orderBy = params.prop;
                     this.fundList();
                 }
            },
            fundDetail(id) {
                this.$router.push({name: 'investing-funds', params: {fundId: id, tabIndex: 0, openWindow: true}})
            },
            // 改变每页显示的条数
            handleSizeChange(val) {
                this.param.pageSize = val;
                this.fundList();
            },
            // 改变当前页
            handleCurrentChange(val) {
                this.param.pageIndex = val;
                if (val > this.totalPage) {
                    this.param.pageIndex = this.totalPage
                }
                this.fundList();
            },
            //文件下载
            downloadFile() {
                 if (this.fundData.length === 0) {
                     this.$message({
                         type: 'warning',
                         message: '无数据!',
                         center: true
                     });
                 } else {
                     window.open(this.baseURL + api.DOWNLOAD_FILE.url + '?X-Token=' + this.$store.state.user.token + '&type=6&name=' + this.keyName + '&fundState=0' );
                 }
            },
        },
        components: {
            csRedDot: require('__components/red-dot'), // 小红点
        },
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    .ca-tab__title {
        position: relative;
        .ca-tab__title--detail {
            @extend .ca-tab__title;
            font-size: 16px;
        }
        .ca-tab__title--list {
            @extend .ca-tab__title;
        }
    }
</style>
